<template>
      <div class="test-1">
            <a-spin>
                  <a-icon slot="indicator" type="loading" style="font-size: 54px;margin-top:15%" spin />
                  <a href="#" @click="sendEmail()" v-if="seeEmail">
                        if you email login,click me send pwd!
                  </a>
                  <a href="#" v-if="seeSecond">
                        30s后可再次发送!!!
                  </a>
            </a-spin>
            
      </div>
</template>

<script>
export default {
      data(){
            return{
                  loading:true,
                  seeEmail:true,
                  seeSecond:false
            }
      },
      watch:{
        seeEmail(val){
          if(!val){
            this.seeSecond=true;
          }
          setInterval(() => {
            this.sendEmailState();
          }, 3000);
        }        
      },
      methods:{
            //发送状态
            sendEmailState(){
                  this.seeSecond=false;
                  this.seeEmail=true;         
            },
            //发送邮件登录
            sendEmail(){
                  // this.loading=loading;
                  this.$message.success("发送成功");
                  this.seeEmail=false;
                  this.seeSecond=true;                   
            },
      }
}
</script>

<style>

</style>